<!DOCTYPE html>
<html lang="ch">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的地址</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/hall.css">
    <link rel="stylesheet" href="css/address.css">
</head>
<body>
<div class="nav">
    <span class="nav">我的地址</span>

    <div data-spm="nav" class="op-container">
        <a class="item-button" href="addUserAddress.html" style="display: flex; align-items: center;">
            <img src="image/store.svg" style="object-fit: contain; width: 24px; height: 24px; margin-right: 4px;">
            <div style="margin-right: 16px;">新增地址</div>
        </a>
        <a class="item-button user" href="#"  style="display: flex; align-items: center;">
            <img id="image" src="image/tx.jpg" style="object-fit: contain; width: 50px; height: 50px; margin-right: 10px; border-radius: 50%;">
            <div id="name" class="username" style="margin-right: 16px; font-size: 20px">null</div>
        </a>
    </div>

</div>



<div class="address-container">

    <div class="addresses" id="addresses">
<!--        <div class="address">-->
<!--            <img class="address-image" src="image/address_default.svg" >-->
<!--            <div class="address-info">-->
<!--                <span style="background-color: #ffeee6; border-radius: 4px; color: #ff5000; font-size: 15px;">默认</span>-->
<!--                <span class="address-name">张天宇</span>-->
<!--                <span class="phone" >19138629521</span><br>-->
<!--                <span class="address-introduction">四川省 成都市 郫都区 合作街道 西源大道1号成都锦城学院</span>-->
<!--            </div>-->
<!--            <div class="address-op">-->
<!--                <span onclick="updateStatusById()" style="color: blue; cursor: pointer">修改</span>-->
<!--                <span onclick="dele()" style="color: blue; cursor: pointer">删除</span>-->
<!--            </div>-->
<!--        </div>-->
    </div>

</div>

<script src="js/jquery.min.js"></script>
<script src="js/user.js"></script>
<script src="js/userAddress.js"></script>
<script>
    let userId = localStorage.getItem("userId");
    console.log(userId);

    $(document).ready(function() {
        selectUserById(userId, flushUser)
        //更新页面用户信息
        function flushUser(userInfo) {
            $('.username').text(userInfo.name);
        }
        //获取默认地址
        getDefaultAddress(userId, showDefaultAddress);

    });
    function showDefaultAddress(address) {
        if(address === null) {
            return;
        }
        const storeBox = $('#addresses');
        let newElement = `
                       <div class="address">
                           <img class="address-image" src="image/address_default.svg" >
                           <div class="address-info">
                                <span style="background-color: #ffeee6; border-radius: 4px; color: #ff5000; font-size: 15px;">默认</span>
                                <span class="address-name">${address.consignee}</span>
                                <span class="phone" >${address.contactPhone}</span><br>
                                <span class="address-introduction">${address.addressDetail}</span>
                            </div>
                            <div class="address-op">
                                <span onclick="window.location.href='/updateUserAddress.html?addressId=${address.addressId}'" style="color: blue; cursor: pointer">修改</span>
                                <span onclick="deleteAddress(${address.addressId})" style="color: blue; cursor: pointer">删除</span>
                            </div>
                       </div>`;
        storeBox.append(newElement);
        //获取用户地址
        getNoDefaultAddress(userId, showAddress);
    }
    //拼接商店数据html
    function showAddress(addresses) {
        const storeBox = $('#addresses');
        for (address of addresses) {
            let newElement = `
                        <div class="address">
                           <img class="address-image" src="image/address.svg" onclick="setDefaultAddress(userId, ${address.addressId})">
                           <div class="address-info">
                                <span class="address-name">${address.consignee}</span>
                                <span class="phone" >${address.contactPhone}</span><br>
                                <span class="address-introduction">${address.addressDetail}</span>
                            </div>
                            <div class="address-op">
                                <span onclick="window.location.href='/updateUserAddress.html?addressId=${address.addressId}'" style="color: blue; cursor: pointer">修改</span>
                                <span onclick="deleteAddress(${address.addressId})" style="color: blue; cursor: pointer">删除</span>
                            </div>
                       </div>`;
            storeBox.append(newElement);
        }
    }

</script>
</body>
</html>